document.addEventListener('DOMContentLoaded', function () {


    // 模拟封装jQuery $
    function $key(getkeys) {
        return document.querySelector(getkeys);
    }


    // 提取日期相关函数
    date();
    function date() {
        var spa = document.querySelector(".dater");
        var timer = null;
        // 封装时间日期格式化
        function mydate() {
            var date = new Date();
            // 时间日期格式化 yyyy-mm-dd hh:mm:ss
            var year = date.getFullYear();
            var month = date.getMonth() + 1;
            var data = date.getDate();
            var hours = date.getHours();
            var minutes = date.getMinutes();
            var seconds = date.getSeconds();
            // 补 0
            month = (month < 10) ? "0" + month : month;
            data = (data < 10) ? "0" + data : data;
            hours = (hours < 10) ? "0" + hours : hours;
            minutes = (minutes < 10) ? "0" + minutes : minutes;
            seconds = (seconds < 10) ? "0" + seconds : seconds;
            var res = `${year}年${month}月${data}日 ${hours}:${minutes}:${seconds}`;
            return res;
        }

        function automove() {
            spa.innerHTML = mydate();
        }
        // 自动走
        setInterval(automove, 1000);
    }


    //添加内容
    var dailytop = document.getElementsByClassName("daily-top")[0];
    dailytop.innerHTML = `
            <div class="Lines"></div>
            <p class="pencil">出差记录</p>
            <input type="text" placeholder="请输入姓名" class="name2">
            <button class="search2">搜索</button>
            <input type="date" class="datetime">
            <span class="apply">申请</span>
    `
    var dailybott = document.getElementsByClassName("daily-bottom")[0];
    dailybott.innerHTML = `
        <table>
              <thead>
                <tr>
                  <th>姓名</th>
                  <th>出差地点</th>
                  <th>出发时间</th>
                  <th>返回时间</th>
                  <th>出差总时长</th>
                  <th>交通工具</th>
                </tr>
              </thead>
              <tbody class="theshy"></tbody>
              <tfoot>
                <tr>
                  <th colspan="6">
                    <button id="uper2">&lt;</button>
                    <div class="age2"></div>
                    <button id="nexter2">&gt;</button>
                  </th>
                </tr>
              </tfoot>
            </table>
    `
    var apply = document.getElementsByClassName("apply")[0];
    apply.onclick = function () {
        myModel({
            mask: true,//显示蒙版
            title: "出差申请",//标题
            content_item1: `
                        <div class="userupdate">
                            <div class="left">
                                <div class="name">姓名: <input type="text" id="userId"></div>
                            <div class="accound name">出差地点: <input type="text" id="address"></div>
                            <div class="password name">交通工具: <input type="text" id="delflag"></div>
                            </div>
                            <div class="right">
                            <div class="userphone name">开始时间: <input type="date" id="businessDate"></div>
                            <div class="userphone name">返回时间: <input type="date" id="endDate"></div>
                            <div class="userphone name">出差总时长: <input type="text" id="duration"></div>
                            </div>
                        </div>
                    `,
            fun: function () {
                // 执行添加的函数
                add()
            }
        })
    }
    function add() {
        var userName = localStorage.getItem(userName);
        var data = {
            userId: Number(localStorage.getItem("userId")),
            businessDate: document.getElementById("businessDate").value,
            address: document.getElementById("address").value,
            duration: Number(document.getElementById("duration").value)
        }
        console.log(data);
        ajax.post(baseUrl.myUrl + "business/insertBusiness", data, function (res) {
            console.log(res);
            pageCount = res.dataset.pageCount;
            if (res.code == 200) {
                // alert("成功");
                businessList()
            }
        })
    }

    //AJAX调接口
    var pageIndex = 1;
    var pageSize = 8;
    function businessList() {
        $key(".theshy").innerHTML = "";
        $key(".age2").innerHTML = " ";
        var jyp = {
            userId: Number(localStorage.getItem("userId")),
            pageIndex: pageIndex,
            pageSize: pageSize
        }
        ajax.post("http://192.168.199.101:8080/BaorSystem/business/businessList", jyp, function (res) {
            if (res.code == 200) {
                pageCount = res.dataset.pageCount;
                console.log(res);
                for (var i = 0; i < pageCount; i++) {
                    //创建元素
                    var btn = document.createElement("button");
                    btn.innerHTML = i + 1;
                    var age2 = document.getElementsByClassName("age2")[0];
                    age2.appendChild(btn);
                }
                for (var item of res.dataset.dailyList) {
                    // 创建元素
                    var newTr2 = document.createElement("tr");
                    newTr2.innerHTML = `
                        <td>${item.userId}</td>
                        <td>${item.address}</td>
                        <td>${item.businessDate}</td>
                        <td>${item.endDate}</td>
                        <td>${item.createTime}</td>
                        <td>${item.delflag}</td>
                    `;
                    $key(".theshy").appendChild(newTr2);
                }
            }
        })
    }
    businessList();
    pagination2()


    //分页
    function pagination2() {
        $key("#nexter2").onclick = function () {//下一页
            pageIndex++;
            if (pageIndex >= pageCount) {
                pageIndex = pageCount;
                this.disabled = true;
            }
            $key("#uper2").disabled = false;
            businessList();
        }
        $key("#uper2").onclick = function () {//上一页
            pageIndex--;
            if (pageIndex <= 1) {
                pageIndex = 1;
                this.disabled = true;
            }
            $key("#nexter2").disabled = false;
            businessList();
        }
    }


    //搜索框
    var search2 = document.getElementsByClassName("search2")[0];
    var name2 = document.getElementsByClassName("name2")[0];
    search2.onclick = function () {
        $key(".theshy").innerHTML = "";
        if (name2.value.trim() === "") {
            businessList();// 搜索框为空时，显示初始数据
        } else {
            searchop();
        }
    }
    function searchop() {
        $key(".theshy").innerHTML = "";
        var jyp = {
            // userId: Number(localStorage.getItem("userId")),
            userId: Number(name2.value),
            // username: name2.value,
        }
        ajax.post("http://192.168.199.101:8080/BaorSystem/business/businessList", jyp, function (res) {
            if (res.code == 200) {
                pageCount = res.dataset.pageCount;
                for (var item of res.dataset.dailyList) {
                    // 创建元素
                    var newTr2 = document.createElement("tr");
                    newTr2.innerHTML = `
                        <td>${item.userId}</td>
                        <td>${item.address}</td>
                        <td>${item.businessDate}</td>
                        <td>${item.endDate}</td>
                        <td>${item.createTime}</td>
                        <td>${item.delflag}</td>
                    `;
                    $key(".theshy").appendChild(newTr2);
                }
            }
        })
    }


    //日期框默认显示
    var datetime = document.getElementsByClassName("datetime")[0];
    datetime.valueAsDate = new Date();


    //页面跳转

    //班级管理
    var classs = document.getElementsByClassName("classs");
    classs[0].onclick = function () {
        location.href = "./ClassManagement.html";
    }
    //日常
    var routine = document.getElementsByClassName("routine")[0];
    routine.onclick = function () {
        location.href = "./daily.html";
    }
    //项目管理
    var project = document.getElementsByClassName("project")[0];
    project.onclick = function () {
        location.href = "./projectmanagement.html";
    }
    //出差记录
    var travel = document.querySelector(".travel");
    travel.addEventListener('click', function () {
        location.href = "./business.html";
    });
    //请假记录
    var excused = document.querySelector(".excused");
    excused.addEventListener('click', function () {
        location.href = "./vacate.html";
    });
    //考勤记录
    var presence = document.querySelector(".presence");
    presence.addEventListener('click', function () {
        location.href = "./clock.html";
    });
    //系统设置
    var system = document.getElementsByClassName("system")[0];
    system.onclick = function () {
        location.href = "./setting.html";
    }
});